<%@ page language="java" contentType="text/html; charset=utf-8"   pageEncoding="utf-8"%>
<%@ page language="java" import="java.util.*"  %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> 
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'index.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<script src="js/jquery-1.9.1.js"></script>
  </head>
  
  <body>
	${renlist}
	<hr>查询测试</hr>
    <a   href="javascript:getRow()">getRow</a>
    ID:<input id="getRow_id" type="text"  value="" />
    <div id="getRow_div"></div>
    <hr>删除测试</hr>
    <a   href="javascript:delRow()">delRow</a>
    ID:<input id="delRow_id" type="text"  value="" />
    <hr>添加测试</hr>
    <a   href="javascript:insterRow()" >insterRow</a>  
    ID:<input id="insterRow_id" type="text"  value="" />
    AA:<input id="insterRow_aa" type="text"  value="" />
    BB:<input id="insterRow_bb" type="text"  value="" />
    CC:<input id="insterRow_cc" type="text"  value="" /> 
    DD:<input id="insterRow_dd" type="text"  value="" /> 
    <hr>更新测试</hr>
    <a  href="javascript:updateRow()"  >updateRow</a>   
    ID:<input id="updateRow_id" type="text"  value="" />
    AA:<input id="updateRow_aa" type="text"  value="" />
    BB:<input id="updateRow_bb" type="text"  value="" />
    CC:<input id="updateRow_cc" type="text"  value="" /> 
    DD:<input id="updateRow_dd" type="text"  value="" />   
    <hr>转账测试</hr>
    <a  href="javascript:transactionTest()"  >transactionTest</a> <br/>
           支出方ID:<input id="id1" type="text"  value="" /><br/>
           接收方ID:<input id="id2" type="text"  value="" /><br/>
            交易金额:(这里金额用到了DD字段，需要保证DD字段为数字)<input id="money" type="text"  value="" />          
  </body>
  <script>
  function getRow(){
	  var data={
	  	ID:$("#getRow_id").val() 
	  }
	  postJsonAjaxRequest(data,"json","modul2/getQiuNingRow.do",function(res){
	  alert("我返回的是json，需要转换成字符串："+res);
	  // JSON.stringify(res)  json对象   变->json字符串
		$("#getRow_div").html(JSON.stringify(res))
	  });
  }
  
  function delRow(){
	  var data={
	  	ID:$("#delRow_id").val()
	  }
	  getJsonAjaxRequest(data,"modul2/delQiuNing.do",function(res){
		    alert("我返回的是字符串"+res);
			if(res=='sucess'){	alert('删除成功！');window.location.reload();
			}else{alert('删除失败！')  }
	  });
  }
  
  function insterRow(){
	  var data={
	  	ID:$("#insterRow_id").val(),
	  	AA:$("#insterRow_aa").val(),
	  	BB:$("#insterRow_bb").val(),
	  	CC:$("#insterRow_cc").val(),
	  	DD:$("#insterRow_dd").val()
	  }
	  postJsonAjaxRequest(data,"html","modul2/insterQiuNing.do",function(res){
		    alert("我返回的是字符串"+res);
			if(res=='sucess'){	
				alert('添加成功！');
				window.location.reload();
			}else{alert('添加失败！')  }
	  });
  }
  
  function updateRow(){
	  var data={
	  	ID:$("#updateRow_id").val(),
	  	AA:$("#updateRow_aa").val(),
	  	BB:$("#updateRow_bb").val(),
	  	CC:$("#updateRow_cc").val(),
	  	DD:$("#updateRow_dd").val()
	  }
	  postJsonAjaxRequest(data,"html","modul2/updateQiuNing.do",function(res){
		    alert("我返回的是字符串"+res);
			if(res=='sucess'){	
				alert('更新成功！');
				window.location.reload();
			}else{alert('更新失败！')  }
	  });
  }
  
  function transactionTest(){
   var data={
	  	ID1:$("#id1").val(),
	  	ID2:$("#id2").val(),
	  	MONEY:$("#money").val()
	  }
	  postJsonAjaxRequest(data,"html","modul2/shiwuTest.do",function(res){
		    res=JSON.parse(res)   //json字符串变     变-> json对象
			if(res.result=='sucess'){	
				alert(res.message);
				window.location.reload();
			}else{alert(res.message)  }
	  });
  }
  </script>
  <!-- 最好以后dataType返回值类型，都是固定的 html,然后利用jQuery JSON.parse(res)转换成json对象-->
  <script>
  //postJsonAjaxRequest(提交的数据,返回值类型，请求的url，请求完的回调方法) 
   function postJsonAjaxRequest(data,dataType,url,callback) {
   	 var val=JSON.stringify(data);
   	 console.log(val)
     $.ajax({
         url:url,
         type: "POST",
         dataType: dataType,//返回值类型
         contentType:"application/json", //这样后台的param才能接收到参数
         data:val,   //这里传入json格式字符串
         success: function (res) {//请求成功完成后要执行的方法
             callback(res)
       	  }
	 })
 }
  //getJsonAjaxRequest(提交的数据,请求的url，请求完的回调方法) 
   function getJsonAjaxRequest(data,url,callback) {
     $.ajax({
         url:url,
         type: "GET",
         dataType: "html",//返回值类型 这里统一返回字符串
         contentType:"text", //get请求这里写 text ，后台只能用 @RequestParam Map map 接收
         data:data,   // 这里传入json对象
         success: function (res) {//请求成功完成后要执行的方法
             callback(res)
       	  }
	 })
    }
 </script>
 
</html>
 <!-- 记录一下 以后 长点心 -->
<!--  $.ajax({
         url:url,
         type: "POST",
         dataType: dataType,//返回值类型 可以是json 也可以 是 html 看心情
         data:val,   //没有 contentType  这里 data 要传入json对象
         success: function (res) {//请求成功完成后要执行的方法
             callback(res)
       	  }
}) -->
